<template>
<div class="v-pd-40">
        <div class="i-layout-page-header">
            <PageHeader title="分配到鱼塘" hidden-breadcrumb
                        :tab-list="tabList"
                        :tab-active-key="tabActiveKey"
                        @on-tab-change="handleChangeTab">
            </PageHeader>
        </div>
    <Card :bordered="false" dis-hover class="ivu-mt" >
        <Form :model="formItem" :label-width="80">
            <row>
                <Col span="6">
                    <FormItem label="日期">
                        <DatePicker :editable="false" type="daterange" placeholder="创建日期" v-model="formItem.date"></DatePicker>
                    </FormItem>
                </Col>
                <Col span="7">
                    <FormItem label="归属人">
                        <Select v-model="formItem.personnel" multiple :max-tag-count="3">
                            <Option v-for="item in personnelList" :value="item.value" :key="item.value">{{ item.label }}</Option>
                        </Select>
                    </FormItem>
                </Col>
                <Col span="18">
                    <FormItem label="数据状态">
                        <CheckboxGroup v-model="formItem.checkbox">
                            <Checkbox label="全部"></Checkbox>
                            <Checkbox label="初诊"></Checkbox>
                            <Checkbox label="复诊"></Checkbox>
                            <Checkbox label="未及时复诊"></Checkbox>
                            <Checkbox label="抗复发"></Checkbox>
                            <Checkbox label="流失"></Checkbox>
                            <Checkbox label="断诊"></Checkbox>
                        </CheckboxGroup>
                    </FormItem>
                </Col>
                <Col span="12">
                    <FormItem label="分配次数">
                         <InputNumber :max="10" :min="1" v-model="formItem.value1"></InputNumber>
                    </FormItem>
                </Col>
            </row>              
            <FormItem>
                <Button style="margin-right: 8px">重置</Button>
                <Button type="primary">筛选</Button>
            </FormItem>
        </Form>
        <Divider />
        <DescriptionList title="筛选结果" :col="3">
            <Description term="筛选用户数：">5158</Description>
        </DescriptionList>
    </Card>
    <FooterToolbar>
        <Button type="primary" class="v-mt-20" @click="confirm" size="large">分配到鱼塘</Button>
    </FooterToolbar>
</div>
</template>

<script>
   import mixin from '../mixins';
    export default {
        name: 'pond',
        mixins: [mixin],
        data () {
            return {
                tabActiveKey: 'pond',
                type: [],
                loading: false,
                single: '',
                formItem: {
                    input: '',
                    input1: '',
                    select: '',
                    radio: 'male',
                    checkbox: [],
                    switch: true,
                    source: '',
                    date: '',
                    value1: 1,
                    personnel: '',
                    personnel1: '',
                    label: '',
                    effect: '',
                    risk: '',
                    city: '',
                    time: ''
                },
                sourceList: [
                    {
                        value: '微信',
                        label: '微信'
                    },
                    {
                        value: '市场转诊',
                        label: '市场转诊'
                    },
                    {
                        value: '抖音',
                        label: '抖音'
                    },
                    {
                        value: '门户',
                        label: '门户'
                    }
                ],
                personnelList: [
                    {
                        value: '王艳',
                        label: '王艳'
                    },
                    {
                        value: '高玲',
                        label: '高玲'
                    },
                    {
                        value: '张在峰',
                        label: '张在峰'
                    },
                    {
                        value: '时宜',
                        label: '时宜'
                    }
                ],
                labelList: [
                    {
                        value: '专家',
                        label: '专家'
                    },
                    {
                        value: '费用',
                        label: '费用'
                    },
                    {
                        value: '敏感',
                        label: '敏感'
                    },
                    {
                        value: '活动',
                        label: '活动'
                    }
                ],
                effectList: [
                    {
                        value: '扩散',
                        label: '扩散'
                    },
                    {
                        value: '无效',
                        label: '无效'
                    },
                    {
                        value: '见效-10%',
                        label: '见效-10%'
                    },
                    {
                        value: '见效-50%',
                        label: '见效-50%'
                    },
                    {
                        value: '治愈-90%',
                        label: '治愈-90%'
                    },
                    {
                        value: '复发',
                        label: '复发'
                    }
                ],
                riskList: [
                    {
                        value: '敏感',
                        label: '敏感'
                    },
                    {
                        value: '正常',
                        label: '正常'
                    },
                    {
                        value: '黑名单',
                        label: '黑名单'
                    },
                    {
                        value: '领导介绍',
                        label: '领导介绍'
                    }
                ],
                cityList: [
                    {
                        value: '合肥',
                        label: '合肥'
                    },
                    {
                        value: '长沙',
                        label: '长沙'
                    },
                    {
                        value: '苏州',
                        label: '苏州'
                    },
                    {
                        value: '六安',
                        label: '六安'
                    }
                ]
            }
        },
        methods: {
            confirm () {
                this.$Modal.confirm({
                    title:'分配到鱼塘',
                    content: '<p>是否将数据分配到鱼塘</p>',
                    onOk: () => {
                        this.$Message.info('分配成功')
                    },
                    onCancel: () => {
                        this.$Message.info('取消分配')
                    }
                })
            }
        }
    }
</script>

<style scoped>
      .v-pd-40 {
          padding-bottom:40px;
      }
</style>
